<template>
  <!--要客服务页面-->
  <div>
    <swiper :imgList="imgList"></swiper>
    <ul>
      <span v-html="config.content"></span>
    </ul>
    <p class="offer" @click="showConfirm">立即购买</p>
  </div>
</template>

<script type="text/ecmascript-6">
  import {yaokefuwu} from '../../../test/unit/http'
  import swiper from '../offertemplate/imgswipertemplate'
  export default {
    name: 'yaokefuwu',
    props: {},
    data() {
      return {
        imgList: [],
        config: {}
      };
    },
    methods: {
      getYaokefuwuData(params){
        var that = this;
        yaokefuwu(params).then(res => {
          if (res.code == 100) {
            that.config = res.object;
            that.imgList = res.object.configImg.split(",");
            console.log(that.imglist)
          }
        })
      },
      showConfirm(){
        this.$router.push({path:'submitorder',query:{goodsId:this.config.goodsId}});
      }
    },
    created() {
      this.getYaokefuwuData({});
    },

    components: {
      swiper
    }
  }
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped lang="less" rel="stylesheet/less">

  ul {
    padding: 10px;
    text-align: left;
    margin-bottom: 50px;
    li:first-child {
      font-size: 20px;
      color: #111;
      font-weight: 700;
    }
    li:nth-child(2) {
      line-height: 25px;
      font-size: 15px;
      color: #666;
      margin: 10px 0;
    }
  }

  .offer {
    position: fixed;
    bottom: 0;
    width: 100%;
    background-image: linear-gradient(to right, #f9964e, #ff8551);
    height: 50px;
    line-height: 50px;
    color: #fff;
  }
</style>
